<template>
  <div>
    <BasicModal
      v-bind="$attrs"
      title="发送测试短信"
      @register="register"
      @ok="send"
      :destroyOnClose="true"
    >
      <BasicForm @register="registerForm" />
    </BasicModal>
  </div>
</template>

<script lang="ts" setup>
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { BasicForm, useForm } from '/@/components/Form';
  import { modalFormStyleSetting } from '/@/settings/thingsBoardDesign';
  import { MessageForm } from './notice.data';
  import { sendTestSms } from '/@/api/thingsborad/settings/BasicSetting/basicSetting';
  import { ref } from 'vue';
  let providerConfiguration = ref({});
  const [register, { closeModal }] = useModalInner((data) => {
    providerConfiguration.value = data;
  });
  const [registerForm, { validate }] = useForm({
    layout: 'vertical',
    schemas: MessageForm,
    showActionButtonGroup: false,
    ...modalFormStyleSetting,
  });
  async function send() {
    let data: Recordable = {};
    try {
      data = await validate();
    } catch (e) {
      return;
    }
    data.providerConfiguration = { ...providerConfiguration.value };
    await sendTestSms(data);
    closeModal();
  }
</script>
